<template>
    <transition name="fade0">
        <div class="myPopup">
            <div class="content_popup">
                <div class="content_header" v-show="title">
                       <h3>{{title}}</h3>
                </div>
                <slot></slot>
                <img :src="imgSrc" alt="" width="200" height="200" v-show="imgSrc">
                <div class="clearfix">
                    <my-button :content="failText" myWidth="100" myHeight="35" borderR="5px" class="fl"
                               v-on:click.native="fail()"></my-button>
                    <my-button :content="successText" myWidth="120" myHeight="35" borderR="5px" class="fr"
                               v-on:click.native="success()"></my-button>
                </div>
            </div>
        </div>
    </transition>
</template>
<style lang="less">
    @import "../../../less/popup/base";
</style>
<script>
    import myButton from '../button.vue'

    export default {
        props: ['width', 'popupStatus', 'imgSrc','failText','successText','title'],
        components: {
            myButton
        },
        data() {
            return {
                startGame: '',
            }
        },
        methods: {
            fail() {
                this.$emit('fail')
//                this.$emit('update:popupStatus', false)
            },
            success() {
                this.$emit('success')
//                this.$emit('update:popupStatus', false)
            }
        },
        mounted() {
            var self = this
            var num = 6
            clearInterval(Time)
            var Time = setInterval(
                function () {
                    if (num == 0) {
                        clearInterval(Time)
                    }
                    self.startGame = "开始游戏（" + num + '）'
                    num--;
                }, 1000)
        }
    }
</script>